import React, { Component } from 'react';
import classNames from 'classnames';
import { withRouter } from 'react-router-dom';
import queryString from 'query-string';

import "./less/leftbar.css";

import { URL } from '../../config';

class App extends Component {

  handleClick (ref) {
    switch (ref) {
      case "settings":
        this.props.history.push(URL.project_setting_page + "?pid=" + queryString.parse(this.props.location.search).pid);
        break;
      case "services":
        this.props.history.push(URL.project_page + "?pid=" + queryString.parse(this.props.location.search).pid);
        break;
      case "online":
        this.props.history.push(URL.addtask_page + "?pid=" + queryString.parse(this.props.location.search).pid);
        break;
      case "trashcan":
        this.props.history.push(URL.trashtask_page + "?pid=" + queryString.parse(this.props.location.search).pid + "&page=1");
        break;
      case "closed":
        this.props.history.push(URL.closetask_page + "?pid=" + queryString.parse(this.props.location.search).pid);
        break;  
      default:
        this.props.history.push(URL.main_page);
    }
  }

  render () {
    return (
      <ul className="leftbar">
        <li onClick={this.handleClick.bind(this, "settings")} className={classNames("baritem", this.props.location.pathname === URL.project_setting_page ? "selected" : null)}>
          <i className={classNames("icon", "settings")}>&#xe60e;</i>
          项目设置
        </li>
        {/* <li className={classNames("baritem", null)}>
          <i className={classNames("icon", "manager")}>&#xe64b;</i>
          成员管理
        </li> */}
        <li onClick={this.handleClick.bind(this, "services")} className={classNames("baritem", this.props.location.pathname === URL.project_page ? "selected" : null)}>
          <i className={classNames("icon", "services")}>&#xe678;</i>
          微服务列表
        </li>
        <li onClick={this.handleClick.bind(this, "online")} className={classNames("baritem", this.props.location.pathname === URL.addtask_page ? "selected" : null)}>
          <i className={classNames("icon", "online")}>&#xe8a7;</i>
          提交上线申请
        </li>
        <li onClick={this.handleClick.bind(this, "trashcan")} className={classNames("baritem", this.props.location.pathname === URL.trashtask_page ? "selected" : null)}>
          <i className={classNames("icon", "trashcan")}>&#xe603;</i>
          上线单草稿
        </li>
        {/* <li onClick={this.handleClick.bind(this, "closed")} className={classNames("baritem", this.props.location.pathname === URL.closetask_page ? "selected" : null)}>
          <i className={classNames("icon", "closed")}>&#xe600;</i>
          已关闭的上线单
        </li> */}
      </ul>
    )
  }
}

export default withRouter(App);